:host {
	display: grid;
	grid-template-columns: subgrid;
	grid-column: 1 / -1;
	min-height: var(--_ui5_list_item_base_height);
	box-sizing: content-box;
	border-bottom: var(--sapList_BorderWidth) solid var(--sapList_BorderColor);
	overflow: clip;
}

:host([tabindex]:focus) {
	outline: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);
	outline-offset: calc(-1 * var(--sapContent_FocusWidth));
}

:host([tabindex]:focus) #selection-cell,
:host([tabindex]:focus) #actions-cell {
	clip-path: inset(var(--sapContent_FocusWidth)); /* focus outline should not overlap sticky cells */
}

::slotted([ui5-table-cell]:first-of-type),
::slotted([ui5-table-header-cell]:first-of-type),
#popin-cell {
	padding-inline-start: var(--_ui5_first_table_cell_horizontal_padding);
}

#selection-cell + ::slotted([ui5-table-cell-base]:first-of-type),
#selection-cell ~ #popin-cell {
	padding-inline-start: var(--_ui5_table_cell_horizontal_padding);
}

#selection-cell {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	left: 0;
}

:dir(rtl)#selection-cell {
	right: 0;
}

#selection-component {
	vertical-align: middle;
}

#actions-cell {
	position: sticky;
	right: 0;
	background-color: inherit;
	flex-wrap: nowrap;
}

:dir(rtl)#actions-cell {
	left: 0;
}